extends ../layout

block content
  .pb-2.mt-2.mb-4.border-bottom
    h3 API Integration Examples

  .row
    .col-md-4
      a(href='/api/github', style='color: #fff')
        .card.text-white.mb-3(style='background-color: #000')
          .card-body
            img(src='https://i.imgur.com/17XNMzb.png', height=40, style='padding: 0px 10px 0px 0px')
            | GitHub
    .col-md-4
      a(href='/api/facebook', style='color: #fff')
        .card.text-white.mb-3(style='background-color: #3b5998')
          .card-body.light-dark
            img(src='https://i.imgur.com/jiztYCH.png', height=40, style='padding: 0px 10px 0px 0px')
            | Facebook
    .col-md-4
      a(href='/api/foursquare', style='color: #000')
        .card.mb-3(style='background-color: #1cafec')
          .card-body
            img(src='https://i.imgur.com/PixH9li.png', height=40, style='padding: 0px 10px 0px 0px')
            | Foursquare
    .col-md-4
      a(href='/api/lastfm', style='color: #fff')
        .card.text-white.mb-3(style='background-color: #d21309')
          .card-body
            img(src='https://i.imgur.com/KfZY876.png', height=40, style='padding: 0px 10px 0px 0px')
            | Last.fm
    .col-md-4
      a(href='/api/nyt', style='color: #fff')
        .card.text-white.mb-3(style='background-color: #454442')
          .card-body
            img(src='https://i.imgur.com/e3sjmYj.png', height=40, style='padding: 0px 10px 0px 0px')
            | New York Times
    .col-md-4
      a(href='/api/steam', style='color: #fff')
        .card.text-white.mb-3(style='background-color: #000')
          .card-body
            img(src='https://i.imgur.com/6WXcNeg.png', height=40, style='padding: 0px 10px 0px 0px')
            | Steam
    .col-md-4
      a(href='/api/twitch', style='color: #fff')
        .card.text-white.mb-3(style='background-color: #6441a5')
          .card-body
            img(src='https://i.imgur.com/dWEkSRX.png', height=40, style='padding: 0px 10px 0px 0px')
            | Twitch
    .col-md-4
      a(href='/api/stripe', style='color: #000')
        .card.mb-3(style='background-color: #3da8e5')
          .card-body
            img(src='https://i.imgur.com/w3s2RvW.png', height=40, style='padding: 0px 10px 0px 0px')
            | Stripe
    .col-md-4
      a(href='/api/paypal', style='color: #000')
        .card.mb-3(style='background-color: #f5f5f5')
          .card-body
            img(src='https://i.imgur.com/JNc0iaX.png', height=40, style='padding: 0px 10px 0px 0px')
            | PayPal
    .col-md-4
      a(href='/api/quickbooks', style='color: #fff')
        .card.text-white.mb-3(style='background-color: #0077c5')
          .card-body
            img(src='https://i.imgur.com/hHk0IgS.png', height=40, style='padding: 0px 10px 0px 0px')
            | QuickBooks
    .col-md-4
      a(href='/api/twilio', style='color: #fff')
        .card.text-white.mb-3(style='background-color: #fd0404')
          .card-body
            img(src='https://i.imgur.com/mEUd6zM.png', height=40, style='padding: 0px 10px 0px 0px')
            | Twilio (text messaging)
    .col-md-4
      a(href='/api/tumblr', style='color: #fff')
        .card.text-white.mb-3(style='background-color: #304e6c')
          .card-body
            img(src='https://i.imgur.com/rZGQShS.png', height=40, style='padding: 0px 10px 0px 0px')
            | Tumblr
    .col-md-4
      a(href='/api/scraping', style='color: #fff')
        .card.text-white.mb-3(style='background-color: #ff6500')
          .card-body
            img(src='https://i.imgur.com/RGCVvyR.png', height=40, style='padding: 0px 10px 0px 0px')
            | Web Scraping
    .col-md-4
      a(href='/api/lob', style='color: #000')
        .card.mb-3(style='background-color: #f5f5f5')
          .card-body
            img(src='https://i.imgur.com/48Q05kF.png', height=40, style='padding: 0px 10px 0px 0px')
            | Lob (USPS mailing)
    .col-md-4
      a(href='/api/upload', style='color: #000')
        .card.mb-3(style='background-color: #f5f5f5')
          .card-body
            img(src='https://i.imgur.com/UPTzIdC.png', height=40, style='padding: 0px 10px 0px 0px')
            | File Upload
    .col-md-4
      a(href='/api/google-maps', style='color: #000')
        .card.mb-3(style='background-color: #0f9d58')
          .card-body
            img(src='https://i.imgur.com/Er2ZqgZ.png', height=40, style='padding: 0px 10px 0px 0px')
            | Google Maps
    .col-md-4
      a(href='/api/here-maps', style='color: #000')
        .card.mb-3(style='background-color: #d1f6f3')
          .card-body
            img(src='https://imgur.com/yWi4aZw.png', height=40, style='padding: 0px 10px 0px 0px')
            | HERE Maps
    .col-md-4
      a(href='/api/chart', style='color: #000')
        .card.mb-3(style='background-color: #f5f5f5')
          .card-body
            img(src='https://www.chartjs.org/img/chartjs-logo.svg', height=40, style='padding: 0px 10px 0px 0px')
            | Chart.js + Alpha Vantage
    .col-md-4
      a(href='/api/google/drive', style='color: #000')
        .card.mb-3(style='background-color: #f5f5f5')
          .card-body
            img(src='https://www.gstatic.com/images/branding/product/1x/drive_48dp.png', height=40, style='padding: 0px 10px 0px 0px')
            | Google Drive
    .col-md-4
      a(href='/api/google/sheets', style='color: #000')
        .card.mb-3(style='background-color: #f5f5f5')
          .card-body
            img(src='https://www.gstatic.com/images/icons/material/product/1x/sheets_64dp.png', height=40, style='padding: 0px 10px 0px 0px')
            | Google Sheets
    .col-md-4
      a(href='/api/trakt', style='color: #fff')
        .card.text-white.mb-3(style='background-color: rgb(0, 0, 0)')
          .card-body
            img(src='https://i.imgur.com/Adtl9qg.png', height=40, style='padding: 0px 10px 0px 0px')
            | trakt.tv
    .col-md-4
      a(href='/api/pubchem', style='color: #fff')
        .card.text-white.mb-3(style='background-color: rgba(128, 200, 255, 1)')
          .card-body
            img(src='https://i.imgur.com/J9bd6qK.png', height=40, style='padding: 0px 10px 0px 0px')
            | PubChem
    .col-md-4
      a(href='/api/wikipedia', style='color: #000')
        .card.mb-3(style='background-color: #f5f5f5')
          .card-body
            img(src='https://image2url.com/images/1759085205020-1c2e0d66-ca19-4b9c-be3a-bd908e6bc485.png', height=40, style='padding: 0px 10px 0px 0px')
            | Wikipedia
    .col-md-4
      a(href='/api/tenor', style='color: #000')
        .card.mb-3(style='background-color: #f5f5f5')
          .card-body
            img(src='https://i.imgur.com/k18Reqx.png', height=40, style='padding: 10px 10px 10px 0px')
            | Tenor GIFs
